<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="jquery-mobile/jquery.mobile-1.1.1.min.css" rel="stylesheet" type="text/css"/>
<link href="css/styles.css" rel="stylesheet" type="text/css"/>


<script src="jquery-mobile/jquery.js" type="text/javascript"></script>
<script src="js/functions.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.1.1.min.js" type="text/javascript"></script>
<script src="js/cordova-1.9.0.js" type="text/javascript"></script>

<script type="text/javascript"
      src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCJdC3CQ8R7WRBANw0QRgQjeWQrx08p1Gc&libraries=places&sensor=true">
    </script>
<script src="js/maps.js" type="text/javascript"></script>   

<script type="text/javascript">
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady(e){
	document.addEventListener("backbutton", onBackButton, false);
}
function onBackButton(e){
    navigator.app.backHistory();

}
</script>
<meta name="viewport" content="width=device-width, initial-scale=1"> 
</head>
<body>
<!--nearby page-->
<div data-role="page" id="nearby">
  <div data-role="header" data-position="fixed" class="purple-blue-title-bar" data-backbtn="false">
  	<span class="ui-btn-left"><a class="goback_button" href="index.html#main_menu" rel="external" data-ajax="false"></a></span>
    <h1>Nearby</h1>
  </div>
  
  <div data-role="navbar" id="search_bar">

  	<fieldset class="ui-grid-a">
	    <div class="ui-block-a" style="width:75%">
  	  		<input type="text" id="search_address" value="" placeholder="Search a place here or drag the marker on map" width="70%"/>
	    </div>
	    <div class="ui-block-b" style="width:25%">
	    	<input type="button" onclick="search();" data-inline="true" data-corners="false" value="Search" />
	    </div>
	</fieldset>
	<div class="center-wrapper">
	<input type="button" onclick="locate();" data-inline="true" data-corners="false" value="ME!" />
  	<button onclick="confirm();" data-inline="true" data-corners="false">Finish</button>
    <a href="places.html" data-ajax="false" data-role="button" data-inline="true" data-corners="false">Places</a>
    <div id="result"></div>
    </div>
  </div>
  <div id="map_canvas" data-role="content">	
  	map content
  </div>
  
</div>
</body>
</html>
